<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>对象类型</title>
    <script>
        function f1() {
            // 使用预定义的对象进行实现
            // js提供了一个预定义对象Object
            // 该对象可以拥有任意属性,可以拥有任意方法
            // 通过对象.属性/方法操作即可
            let obj = new Object();
            obj.id = 1;
            obj.name = "admin";
            obj.age = 18;
            // 当属性值是函数类型是,相当于方法
            obj.show = function(){
                console.log("id:"+this.id+",name:"+obj.name+",age:"+this.age);
            };
            console.log(obj.id);
            console.log(obj.name);
            console.log(obj.age);
            obj.show();
        }

        function f2(){
            // 自定义对象
            // 在js中,自定义的对象指的是定义一个新的函数
            // 该函数相当于Java中的构造函数
            let user = new User(1,"admin","123456");
            // 可以像Object一样,定义任意属性
            // 为指定属性赋值后,该对象将拥有对应属性
            user.age = 18;
            console.log(user);
        }

        function User(id,username,password){
            this.id = id;
            this.username = username;
            this.password = password;
        }

        function f3(){
            // 使用JSON语法定义对象
            // JSON本质上就是一个对象
            // let user = {"id":1,"username":"admin","password":"123456"};
            let user = {'id':1,'username':'admin','password':'123456'};
            console.log(user);
        }

        function f4(){
            let user = "{'id':1,'username':'admin','password':'123456'}";
            console.log(typeof user);
            // 方式一:通过eval方法进行转换
            // 此时参数必须使用小括号括起来
            // 该方式属于通用型,适用于所有场景,但是安全性较低
            let userJson = eval("("+user+")");
            console.log(userJson);

            let user2 = '{"id":1,"username":"admin","password":"123456"}';
            console.log(typeof user2);
            let userJson2 = eval("("+user2+")");
            console.log(userJson2);

            // 方式二:使用JSON.parse()进行转换
            // 该方式安全性较高,但是只适用于单引号字符串
            userJson2 = JSON.parse(user2);
            console.log(userJson2);

            // 遇到双引号字符串会报错
            userJson = JSON.parse(user);
            console.log(userJson);
        }
    </script>
</head>
<body>
<button onclick="f1()">定义方式一</button><br>
<button onclick="f2()">定义方式二</button><br>
<button onclick="f3()">定义方式三</button><br>
<button onclick="f4()">定义方式四</button><br>
</body>
</html>